<header class="article-header-bg music-header-bg">
	<figure>
            <!-- 输出第一张缩略图 -->
            <img data-src="<?php echo _getThumbnails($this)[0] ?>" alt="<?= $this->title ?> 封面图" class="cover-image">
            <!-- 占位图 -->
            <div class="dynamic-background"></div>
		    <i class="loading">封面图加载中</i>
	</figure>
	<div class="music-header-content">
		<h3 class="music-title">
			<?php $this->title() ?>
		</h3>
		<div class="meta-bar">
			<span class="meta-item">
				<svg class="meta-icon" viewBox="0 0 24 24">
					<path d="M12 4a4 4 0 0 1 4 4 4 4 0 0 1-4 4 4 4 0 0 1-4-4 4 4 0 0 1 4-4m0 10c4.42 0 8 1.79 8 4v2H4v-2c0-2.21 3.58-4 8-4z" />
				</svg>
				<?php $this->author(); ?>
			</span>
			<span class="meta-item">
				<svg class="meta-icon" viewBox="0 0 24 24">
					<path d="M19 3h-1V1h-2v2H8V1H6v2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11z" />
				</svg>
				<?php $this->date(); ?>
			</span>
			<span class="meta-item">
				<svg class="meta-icon" viewBox="0 0 24 24">
					<path d="M16 13c.55 0 1-.45 1-1s-.45-1-1-1-1 .45-1 1 .45 1 1 1zm-6 0c.55 0 1-.45 1-1s-.45-1-1-1-1 .45-1 1 .45 1 1 1zm6-6c.55 0 1-.45 1-1s-.45-1-1-1-1 .45-1 1 .45 1 1 1zm-6 0c.55 0 1-.45 1-1s-.45-1-1-1-1 .45-1 1 .45 1 1 1zm2-7C6.48 0 2 4.48 2 10s4.48 10 10 10 10-4.48 10-10S17.52 0 12 0z" />
				</svg>
				<?php get_post_view($this) ?> 热度
			</span>
			<span class="meta-item">
				<svg class="meta-icon" viewBox="0 0 24 24">
					<path d="M20 2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h14l4 4V4c0-1.1-.9-2-2-2zm-2 12H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z" />
				</svg>
				<?php $this->commentsNum('0 评论', '1 评论', '%d 评论'); ?>
			</span>
		</div>
		<article class="main-content">
		    <div class="text-layout">
		        <?php _article_changetext($this); ?>
		    </div>
		</article>
		<section class="comments-wrapper">
            <?php $this->need('comments.php');?>
        </section>
	</div>
</header>